<!DOCTYPE HTML>
<html  lang="zh" xmlns:th="http://www.thymeleaf.org">
<meta charset="utf-8">
<head th:include="include :: header"></head>
<body class="white-bg">
    <div class="wrapper wrapper-content animated fadeInRight ibox-content">
        <!--<form class="form-horizontal m" id="form-banner-add">-->

		<div class="form-group">
			<label class="col-sm-3 control-label">图片展示：</label>
			<div id="img_content"  class="col-sm-8">
			</div>
		</div>
			<div class="form-group">
				<label class="col-sm-3 control-label">标题：</label>
				<div class="col-sm-8">
					<input id="title" name="title" class="form-control" type="text">
				</div>
			</div>
			<div class="form-group">
				<label class="col-sm-3 control-label">跳转链接：</label>
				<div class="col-sm-8">
					<input id="url" name="url" class="form-control" type="text">
				</div>
			</div>
			<div class="form-group">
				<label class="col-sm-3 control-label">图片地址：</label>
				<div class="col-sm-8">
					<div class="new-contentarea tc">
						<input type="file" class="btn btn-default" onchange="jsReadFiles(this.files)" name="image"  accept="image/*"/>
					</div>
				</div>
			</div>
			<div class="form-group">
				<label class="col-sm-3 control-label">类型<font color="red">*</font>：</label>
				<div class="col-sm-8">
					<input id="type" name="type"   class="form-control" type="text">
				</div>
			</div>
		<div class="form-group">
			<label class="col-sm-3 control-label">app类型：</label>
			<div class="col-sm-8" th:with="type=${@dict.getType('app_type')}">
				<div th:each="dict : ${type}" th:class="${dict['cssClass']}">
					<input type="radio" th:id="${dict['dictCode']}" name="appType" class="appType" th:value="${dict['dictValue']} " th:checked="${dict['isDefault'] == 'Y' ? true : false}">
					<label th:for="${dict['dictCode']}" th:text="${dict['dictLabel']}"></label>
				</div>
			</div>

		</div>

        			<!--<div class="form-group">	-->
				<!--<label class="col-sm-3 control-label">添加时间：</label>-->
				<!--<div class="col-sm-8">-->
					<!--<input id="createTime" name="createTime" class="form-control" type="text">-->
				<!--</div>-->
			<!--</div>-->
			<div class="form-group">
				<div class="form-control-static col-sm-offset-9">
					<button  id="lbbut" class="btn btn-primary">提交</button>
					<button onclick="$.modal.close()" class="btn btn-danger" type="button" >关闭</button>
				</div>
			</div>
		<!--</form>-->
	</div>
    <div th:include="include::footer"></div>
	<script th:src="@{/ajax/libs/cropbox/cropbox.js}"></script>
	<script type="text/javascript">
        $(window).load(function() {
            var prefix = ctx + "module/banner";
            $('#lbbut').on('click', function () {
                var formdata = new FormData();
                var appType;
                var argsInput = $(".appType");
                for(var i in argsInput){
                    if(argsInput[i].checked){
                        appType=argsInput[i].value;
                        formdata.append("appType", appType);
                    }
                }

                formdata.append("bannerfile", $("input[name=image]")[0].files[0]);
                formdata.append("title", $("input[name=title]").val());
                formdata.append("url", $("input[name=url]").val());
                formdata.append("type", $("input[name=type]").val());

                $.ajax({
                        url: prefix + "/add",
                        type: "POST",
                        data: formdata,
                        processData: false,
                        contentType: false,
                        success: function (result) {
                            $.operate.saveSuccess(result);
                        }
                    }
                );
            })
        })
        function jsReadFiles(files) {
            if (files.length) {
                var file = files[0];
                var reader = new FileReader();//new一个FileReader实例
                if (/text+/.test(file.type)) {//判断文件类型，是不是text类型
                    reader.onload = function() {
                        $('#img_content').html('<pre>' + this.result + '</pre>');
                    }
                    reader.readAsText(file,'gbk');

                } else if(/image+/.test(file.type)) {//判断文件是不是imgage类型
                    reader.onload = function() {
                        $('#img_content').html('<img src="' + this.result + '" style="width: 100%;height: 100%"/>');
                    }
                    reader.readAsDataURL(file);
                }
            }
        }
	</script>

    <!--<script type="text/javascript">
		var prefix = ctx + "module/banner"
		$("#form-banner-add").validate({
			rules:{
				xxxx:{
					required:true,
				},
			},
			submitHandler: function(form) {
				$.operate.save(prefix + "/add", $('#form-banner-add').serialize());
			}
		});
	</script>-->
</body>
</html>
